<script setup>
import SimplifyHeader from "@/components/SimplifyHeader.vue";
import Form1 from "@/views/editUser/Form1.vue";
import Form2 from "@/views/editUser/Form2.vue";
import Form3 from "@/views/editUser/Form3.vue";
import { onMounted, ref } from "vue";
import { ElMessage } from "element-plus";
import { getSalesBaseInfo, updateInfo } from "@/api/user.js";
import router from "@/router/index.js";

const form1 = ref();
const form2 = ref();
const form3 = ref();

const next = async () => {
  try {
    await form1.value.checkForm();
    //
    const form2Value = await form2.value.skill;
    console.log(form2Value);
    let checkForm2 = true;
    for (let i = 0; i < form2Value.length; i++) {
      const form2Item = form2Value[i];
      if (!form2Item.goodsTypeId || !form2Item.experienceYear) {
        checkForm2 = false;
        continue;
      }
    }
    if (!checkForm2) {
      return ElMessage.warning("请完善专业技能信息");
    }
    //
    const from3Value = form3.value.education;
    let checkForm3 = true;
    for (let i = 0; i < from3Value.length; i++) {
      const form3Item = from3Value[i];
      if (
        !form3Item.type ||
        !form3Item.schoolName ||
        !form3Item.graduateTime ||
        form3Item.fullTime === ""
      ) {
        checkForm3 = false;
        continue;
      }
    }
    if (!checkForm3) {
      return ElMessage.warning("请完善教育背景信息");
    }
    form1.value.formData.address = form1.value.formData.address.join(",");
    const paramsData = {
      ...form1.value.formData,
      skill: form2Value,
      educations: from3Value,
    };
    const update = await updateInfo(paramsData);
    if (update.code === 200) {
      await router.push("/realName");
      //await router.push('/')
    } else {
      return ElMessage.error(update.msg);
    }
  } catch (e) {
    console.log(e);
  }
};

onMounted(() => {
  getInfo();
});

// 初始化获取用户信息，回填
const info = ref({});
const getInfo = async () => {
  try {
    const res = await getSalesBaseInfo();
    if (res.code === 200) {
      info.value = res.data;
    }
  } catch (e) {
    console.log(e);
  }
};

//
const exit = () => {
  router.push("/login");
};
</script>

<template>
  <div class="edit-user">
    <SimplifyHeader />
    <div class="form-items">
      <Form1 ref="form1" :info="info" />
      <Form2 ref="form2" :info="info" />
      <Form3 ref="form3" :info="info" />
    </div>
    <div class="btns" v-if="step !== 0">
      <el-button class="close" @click="exit">退出</el-button>
      <el-button class="next" @click="next">下一步</el-button>
    </div>
  </div>
</template>

<style scoped lang="scss">
.edit-user {
  background: #f9f9f9;
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.form-items {
  flex: 1;
  height: calc(100vh - 80px);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

.btns {
  display: flex;
  height: 80px;
  align-items: center;
  justify-content: center;
  background: #fff;

  .close {
    width: 92px;
    height: 36px;
    background: #ffffff;
    border-radius: 8px 8px 8px 8px;
    border: 1px solid rgba(25, 30, 40, 0.08);
    color: rgba(25, 30, 40, 0.6);
  }

  .next {
    width: 92px;
    height: 36px;
    background: #1dbf73;
    border-radius: 8px 8px 8px 8px;
    color: #fff;
  }
}
</style>

<style>
.edit-user .el-input__wrapper {
  height: 48px;
  border-radius: 8px 8px 8px 8px;
  border: 1px solid rgba(25, 30, 40, 0.08);
  box-shadow: none;
}
</style>